/* 
 * 首页移动端优化样式
 * 主要针对"石化行业智能税务风险分析"板块
 * ===================================
 */

/* 通用移动端优化 */
@media screen and (max-width: 768px) {
    /* 修复可能的溢出问题 */
    body {
        overflow-x: hidden;
    }
    
    /* 容器宽度限制 */
    .container {
        width: 100%;
        padding-left: 15px;
        padding-right: 15px;
    }
    
    /* 行布局优化 */
    .row {
        margin-left: -15px;
        margin-right: -15px;
    }
    
    /* 列布局优化 */
    [class*="col-"] {
        padding-left: 15px;
        padding-right: 15px;
        width: 100%;
        margin-bottom: 20px;
    }
}

/* 移动端优化 - 首页英雄区域 */
@media screen and (max-width: 768px) {
    /* 首页英雄区域 - 标题和内容居中 */
    .hero-section {
        text-align: center;
        padding: 40px 20px;
    }
    
    /* 首页英雄区域 - 内容居中 */
    .hero-section .container {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
    }
    
    /* 首页英雄区域 - 内容宽度 */
    .hero-content {
        width: 100% !important; /* 覆盖电脑端的宽度设置 */
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        margin-bottom: 30px;
    }
    
    /* 首页英雄区域 - 标题样式 */
    .hero-section h1,
    .hero-title {
        font-size: 24px;
        line-height: 1.3;
        margin-bottom: 15px;
        text-align: center;
        width: 100%;
    }
    
    /* 首页英雄区域 - 副标题样式 */
    .hero-section h2 {
        font-size: 16px;
        line-height: 1.5;
        margin-bottom: 20px;
        text-align: center;
    }
    
    /* 首页英雄区域 - 描述文本 */
    .hero-section p,
    .hero-description {
        font-size: 14px;
        line-height: 1.6;
        margin: 0 auto 25px;
        max-width: 100%;
        text-align: center;
    }
    
    /* 首页英雄区域 - 按钮容器 */
    .hero-buttons {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 15px;
        width: 100%;
    }
    
    /* 首页英雄区域 - 按钮样式 */
    .hero-buttons .btn {
        width: 100%;
        max-width: 250px;
        height: 44px;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    
    /* 首页英雄区域 - 修复按钮居中对齐 */
    .hero-buttons a,
    .hero-buttons .btn-primary,
    .hero-buttons .btn-outline,
    .hero-buttons .btn-lg {
        margin: 0 auto;
        text-align: center;
        width: 100%;
        max-width: 250px;
    }
    
    /* 优化聊天演示区域在移动端的显示 */
    .hero-image {
        width: 100% !important; /* 覆盖电脑端的宽度设置 */
    }
    
    .chat-demo {
        width: 100%;
        max-width: 350px;
        margin: 0 auto;
    }
    
    /* 首页石化行业板块 - 内容布局 */
    .industry-hero,
    .petrochemical-section,
    .petrochemical-hero,
    .tax-risk-section,
    .tax-risk-hero {
        display: flex;
        flex-direction: column;
        align-items: center;
        padding: 30px 15px;
        text-align: center;
    }
    
    /* 首页石化行业板块 - 标题样式 */
    .industry-hero h2,
    .petrochemical-hero h2,
    .tax-risk-hero h2,
    .section-title {
        font-size: 22px;
        text-align: center;
        margin-bottom: 15px;
        width: 100%;
    }
    
    /* 首页石化行业板块 - 副标题样式 */
    .industry-hero h3,
    .petrochemical-hero h3,
    .tax-risk-hero h3,
    .section-subtitle {
        font-size: 16px;
        text-align: center;
        margin-bottom: 20px;
        width: 100%;
    }
    
    /* 首页石化行业板块 - 描述文本 */
    .industry-hero p,
    .petrochemical-hero p,
    .tax-risk-hero p,
    .section-description {
        text-align: center;
        font-size: 14px;
        line-height: 1.6;
        margin: 0 auto 20px;
        width: 100%;
    }
    
    /* 首页石化行业板块 - 特点列表 */
    .industry-features,
    .petrochemical-features,
    .tax-risk-features {
        display: grid;
        grid-template-columns: 1fr;
        gap: 15px;
        width: 100%;
    }
    
    /* 首页石化行业板块 - 特点项 */
    .industry-feature-item,
    .petrochemical-feature-item,
    .tax-risk-feature-item,
    .feature-card {
        background-color: rgba(255, 255, 255, 0.9);
        border-radius: 8px;
        padding: 15px;
        text-align: center;
        box-shadow: 0 3px 10px rgba(0, 0, 0, 0.1);
    }
    
    /* 首页石化行业板块 - 特点图标 */
    .industry-feature-icon,
    .petrochemical-feature-icon,
    .tax-risk-feature-icon,
    .feature-icon {
        width: 50px;
        height: 50px;
        margin: 0 auto 10px;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    
    /* 首页石化行业板块 - 特点标题 */
    .industry-feature-title,
    .petrochemical-feature-title,
    .tax-risk-feature-title,
    .feature-title {
        font-size: 16px;
        font-weight: 600;
        margin-bottom: 8px;
        text-align: center;
    }
    
    /* 首页石化行业板块 - 特点描述 */
    .industry-feature-desc,
    .petrochemical-feature-desc,
    .tax-risk-feature-desc,
    .feature-desc {
        font-size: 14px;
        line-height: 1.5;
        text-align: center;
    }
    
    /* 首页石化行业板块 - 背景渐变 */
    .petrochemical-section {
        background: linear-gradient(135deg, #f0f8ff 0%, #e6f2ff 100%);
        padding: 30px 15px;
        border-radius: 0;
    }
    
    /* 首页石化行业板块 - 内容容器 */
    .petrochemical-content,
    .tax-risk-content,
    .section-content {
        max-width: 100%;
        margin: 0 auto;
        display: flex;
        flex-direction: column;
        align-items: center;
    }
    
    /* 确保所有文本在移动端居中对齐 */
    .petrochemical-section *,
    .tax-risk-section * {
        text-align: center;
    }
    
    /* 修复可能的左对齐问题 */
    .petrochemical-section div,
    .tax-risk-section div {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        width: 100%;
    }
    
    /* 修复列表项的对齐问题 */
    .petrochemical-section ul,
    .tax-risk-section ul {
        padding-left: 0;
        list-style-position: inside;
        width: 100%;
        text-align: center;
    }
    
    /* 修复列表项的样式 */
    .petrochemical-section li,
    .tax-risk-section li {
        text-align: center;
        margin-bottom: 10px;
    }
    
    /* 特定针对"石化行业智能税务风险分析"板块 */
    .petrochemical-risk-analysis,
    .tax-risk-analysis {
        padding: 25px 15px;
        text-align: center;
    }
    
    .petrochemical-risk-analysis h2,
    .tax-risk-analysis h2 {
        font-size: 22px;
        margin-bottom: 15px;
        text-align: center;
        width: 100%;
    }
    
    .petrochemical-risk-analysis h3,
    .tax-risk-analysis h3 {
        font-size: 16px;
        margin-bottom: 20px;
        text-align: center;
        width: 100%;
    }
    
    .petrochemical-risk-analysis p,
    .tax-risk-analysis p {
        font-size: 14px;
        line-height: 1.6;
        margin: 0 auto 20px;
        text-align: center;
        width: 100%;
    }
    
    /* 石化行业风险分析卡片布局 */
    .risk-cards,
    .feature-cards {
        display: grid;
        grid-template-columns: 1fr;
        gap: 15px;
        width: 100%;
    }
    
    /* 石化行业风险分析卡片样式 */
    .risk-card,
    .feature-box {
        background-color: #ffffff;
        border-radius: 8px;
        padding: 15px;
        box-shadow: 0 3px 10px rgba(0, 0, 0, 0.1);
        text-align: center;
        display: flex;
        flex-direction: column;
        align-items: center;
    }
    
    .risk-card-icon,
    .feature-icon {
        width: 50px;
        height: 50px;
        margin: 0 auto 10px;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    
    .risk-card-title,
    .feature-title {
        font-size: 16px;
        font-weight: 600;
        margin-bottom: 8px;
        text-align: center;
        width: 100%;
    }
    
    .risk-card-desc,
    .feature-desc {
        font-size: 14px;
        line-height: 1.5;
        text-align: center;
        width: 100%;
    }
    
    /* 修复表格在移动端的显示 */
    table {
        width: 100%;
        display: block;
        overflow-x: auto;
    }
    
    /* 修复图片在移动端的显示 */
    img {
        max-width: 100%;
        height: auto;
        margin: 0 auto;
        display: block;
    }
    
    /* 修复可能的文本溢出问题 */
    * {
        word-wrap: break-word;
        overflow-wrap: break-word;
    }
    
    /* 修复石化行业板块的特定样式 */
    .petrochemical-analysis-section,
    .petrochemical-risk-section,
    .tax-analysis-section,
    .tax-risk-section {
        padding: 30px 15px;
    }
    
    /* 修复任何可能的水平滚动 */
    .row, .container, section {
        max-width: 100vw;
        overflow-x: hidden;
    }
    
    /* 确保石化行业板块中的所有元素居中对齐 */
    [class*="petrochemical-"],
    [class*="tax-risk-"] {
        text-align: center !important;
    }
    
    /* 修复石化行业板块中可能的浮动问题 */
    [class*="petrochemical-"]:after,
    [class*="tax-risk-"]:after {
        content: "";
        display: table;
        clear: both;
    }
    
    /* 确保按钮在移动端居中显示 */
    .btn-container,
    .button-group {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 10px;
        width: 100%;
    }
    
    /* 确保所有按钮宽度一致 */
    .btn,
    .button {
        width: 100%;
        max-width: 250px;
        text-align: center;
        display: flex;
        align-items: center;
        justify-content: center;
    }
}

/* 小屏幕手机优化 */
@media screen and (max-width: 375px) {
    /* 进一步缩小标题和文字大小 */
    .hero-section h1,
    .hero-title {
        font-size: 22px;
    }
    
    .hero-section h2 {
        font-size: 15px;
    }
    
    .industry-hero h2,
    .petrochemical-hero h2,
    .tax-risk-hero h2,
    .section-title,
    .petrochemical-risk-analysis h2,
    .tax-risk-analysis h2 {
        font-size: 20px;
    }
    
    .industry-hero h3,
    .petrochemical-hero h3,
    .tax-risk-hero h3,
    .section-subtitle,
    .petrochemical-risk-analysis h3,
    .tax-risk-analysis h3 {
        font-size: 15px;
    }
    
    /* 减少内边距，节约空间 */
    .industry-feature-item,
    .petrochemical-feature-item,
    .tax-risk-feature-item,
    .feature-card,
    .risk-card,
    .feature-box {
        padding: 12px;
    }
}

/* 超小屏幕优化 */
@media screen and (max-width: 320px) {
    html {
        font-size: 14px;
    }
    
    /* 进一步缩小字体大小 */
    .hero-section h1,
    .hero-title,
    .section-title,
    .petrochemical-risk-analysis h2,
    .tax-risk-analysis h2 {
        font-size: 18px;
    }
    
    .hero-section h2,
    .section-subtitle,
    .petrochemical-risk-analysis h3,
    .tax-risk-analysis h3 {
        font-size: 14px;
    }
}

/* 确保产品卡片在移动端有正确的样式 */
.product-card {
    background-color: #fff;
    border-radius: 12px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
    padding: 20px;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    position: relative;
    overflow: hidden;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
}

/* 确保产品卡片背景一致 */
.product-card::before {
    background-image: none !important;
}

/* 确保图标颜色一致 */
.product-card .icon path {
    fill: var(--primary-color);
}

/* 确保卡片标题和描述居中 */
.product-card .card-title,
.product-card .card-description {
    text-align: center;
    width: 100%;
}

/* 确保小圆点颜色一致 */
.product-card .card-features li::before {
    color: var(--secondary-color, #e56d00);
} 